import Vue from 'vue'
import VueRouter from 'vue-router'

import Login from '../pages/Login'
import Home from '../pages/Home'
import Detail from '../pages/Detail'
import About from '../pages/About'

// Home下的二级路由
import Homes from '../pages/home/Homes'
import List from '../pages/home/List'
import Server from '../pages/home/Server'
import My from '../pages/home/My'

Vue.use(VueRouter)

const router = new VueRouter({
    mode: "history",
    routes: [
        {
            path: '/',
            redirect: '/home'
        },
        {
            path: "/home",
            component: Home,
            // 子路由
            children: [
                {
                    path: '/home',
                    redirect: '/home/homes'
                },
                {
                    path: "homes",
                    component: Homes
                },
                {
                    path: "list",
                    component: List
                },
                {
                    path: "server",
                    component: Server
                },
                {
                    path: "my",
                    component: My
                }
            ]
        },
        {
            path: "/login",
            component: Login
        },
        {
            path: "/detail",
            component: Detail
        },
        {
            name: "about",
            path: "/about",
            component: About
        }
    ]
})

// 全局进入页面前拦截
// beforeEach(callback)
router.beforeEach((to, from, next) => {
    // to  ==>  去往的页面
    // from ==>  从那个页面来
    if (to.path === "/home/my" && !sessionStorage.getItem('token')) {
        // this.$router  === 路由实例
        // router.push('/login')
        next('/login')
    } else {
        // 无需拦截，进入下一个页面
        next()
    }

    // next执行下一步  (必须调用next才能访问到下一个页面)
})

// 全局进入页面之前拦截
// router.afterEach((to, from) => {
//     console.log('我现在进入页面了')
//     console.log(to)
// })

export default router

